<!doctype html>
<html lang="en">
  <head>
    <meta charset="utf-8">
    <meta name="description" content="This is just a test document for Benchmark.js.">
    <title>Benchmark.js test page | jsPerf</title>
    <!-- https://jsperf.com/benchmark-js-test-page -->
    <link rel="stylesheet" href="main.css">
    <meta name="referrer" content="never">
    <meta name="robots" content="noindex">
    <script>document.documentElement.className = 'js'</script>
    <!--[if lt IE 9]><script src="https://cdnjs.cloudflare.com/ajax/libs/html5shiv/3.7.2/html5shiv.js"></script><![endif]-->
  </head>
  <body>
    <article>
      <hgroup>
        <h1>Benchmark.js test page</h1>
        <h2>JavaScript performance comparison</h2>
      </hgroup>

      <p class="meta">
        Test case created by <a href="https://mathiasbynens.be/">Mathias</a>
        <time datetime="2010-08-02T18:45:23+02:00" pubdate>40 seconds ago</time>
        and last updated <time datetime="2010-08-02T18:45:51+02:00">12 seconds ago</time>
      </p>

      <section>
        <h2>Info</h2>
        <p>
          This is just a test document for Benchmark.js.
        </p>
      </section>

      <section id="prep-code">
        <h2>Preparation code</h2>
        <pre><code><span
          class="sc2">&lt;<span class="kw2">div</span>&gt;</span>Lorem ipsum<span
          class="sc2">&lt;<span class="sy0">/</span><span class="kw2">div</span>&gt;</span><br><span
          class="sc2">&lt;<span class="kw2">script</span>&gt;</span><br>&nbsp; <span
          class="kw2">var</span> arr <span class="sy0">=</span> <span class="br0">&#91;</span><span
          class="nu0">1</span><span class="sy0">,</span> <span class="nu0">5</span><span
          class="sy0">,</span> <span class="nu0">4</span><span class="sy0">,</span> <span
          class="nu0">2</span><span class="sy0">,</span> <span class="nu0">3</span><span
          class="br0">&#93;</span><span class="sy0">;</span><br><br>&nbsp; <span
          class="kw2">function</span> init<span class="br0">&#40;</span><span
          class="br0">&#41;</span> <span class="br0">&#123;</span><br>&nbsp;&nbsp;&nbsp; window.<span
          class="me1">console</span> <span class="sy0">&amp;&amp;</span> console.<span
          class="me1">log</span><span class="br0">&#40;</span><span class="st0">'init called'</span><span
          class="br0">&#41;</span><span class="sy0">;</span><br>&nbsp; <span
          class="br0">&#125;</span><br><span class="sc2">&lt;<span class="sy0">/</span><span
          class="kw2">script</span>&gt;</span><br><span class="sc2">&lt;<span
          class="kw2">script</span>></span><br>Benchmark.<span class="me1">prototype</span>.<span
          class="me1">setup</span> <span class="sy0">=</span> <span class="kw2">function</span><span
          class="br0">(</span><span class="br0">)</span> <span class="br0">{</span><br>&nbsp; window.<span
          class="me1">foo</span> <span class="sy0">=</span> <span class="nu0">42</span><span
          class="sy0">;</span><br>&nbsp; <span class="kw2">var</span> x <span
          class="sy0">=</span> arr<span class="sy0">;</span><br><span class="br0">}</span><span
          class="sy0">;</span><br><br>Benchmark.<span class="me1">prototype</span>.<span
          class="me1">teardown</span> <span class="sy0">=</span> <span class="kw2">function</span><span
          class="br0">(</span><span class="br0">) </span><span class="br0">{</span><br>&nbsp; window.<span
          class="me1">foo</span> <span class="sy0">=</span> <span class="nu0">24</span><span
          class="sy0">;</span><br><span class="br0">}</span><span class="sy0">;</span><br><span
          class="sc2">&lt;<span class="sy0">/</span><span class="kw2">script</span>></span></code></pre>
      </section>

      <section>
        <h2>Preparation code output</h2>
        <div class="user-output">
          <div>Lorem ipsum</div>
        </div>
      </section>

      <section id="runner">
        <h2>Test runner</h2>
        <p id="firebug">
          <strong>Warning! For accurate results, please disable Firebug before running the tests. <a href="https://jsperf.com/faq#firebug-warning">(Why?)</a></strong>
        </p>
        <p id="status">
          <noscript>
            <strong>To run the tests, please <a href="http://enable-javascript.com/">enable JavaScript</a> and reload the page.</strong>
          </noscript>
        </p>
        <div id="controls">
          <button id="run" type="button"></button>
        </div>
        <table id="test-table">
          <caption>Testing in <span id="user-agent"></span></caption>
          <thead>
          <tr>
            <th colspan="2">Test</th>
            <th title="Operations per second (higher is better)">Ops/sec</th>
          </tr>
          </thead>
          <tbody>
          <tr>
            <th scope="row" id="title-1">
              <div>Normal</div>
            </th>
            <td class="code">
              <pre><code>x.<span class="me1">sort</span><span class="br0">&#40;</span><span
                class="kw2">function</span><span class="br0">&#40;</span>a<span
                class="sy0">,</span> b<span class="br0">&#41;</span> <span
                class="br0">&#123;</span><br>&nbsp; <span class="kw1">return</span> a <span
                class="sy0">-</span> b<span class="sy0">;</span><br><span
                class="br0">&#125;</span><span class="br0">&#41;</span><span
                class="sy0">;</span></code></pre>
            </td>
            <td id="results-1" class="results"></td>
          </tr>
          <tr>
            <th scope="row" id="title-2">
              <div>Exit Early</div>
            </th>
            <td class="code">
              <pre><code>x.<span class="me1">sort</span><span class="br0">&#40;</span><span
                class="kw2">function</span><span class="br0">&#40;</span>a<span
                class="sy0">,</span> b<span class="br0">&#41;</span> <span
                class="br0">&#123;</span><br>&nbsp; <span class="kw1">return</span> a <span
                class="sy0">-</span> b<span class="sy0">;</span><br><span
                class="br0">&#125;</span><span class="br0">&#41;</span><span
                class="sy0">;</span><br><span class="kw1">return</span><span
                class="sy0">;</span></code></pre>
            </td>
            <td id="results-2" class="results"></td>
          </tr>
          <tr>
            <th scope="row" id="title-3">
              <div>Async</div>
            </th>
            <td class="code">
              <pre><code><strong class="co1">// async test</strong><br>setTimeout<span
                class="br0">&#40;</span><span class="kw2">function</span><span
                class="br0">&#40;</span><span class="br0">&#41;</span> <span
                class="br0">&#123;</span><br>&nbsp; deferred.<span
                class="me1">resolve</span><span class="br0">&#40;</span><span
                class="br0">&#41;</span><span class="sy0">;</span><br><span
                class="br0">&#125;</span><span class="sy0">,</span> <span
                class="nu0">10</span><span class="br0">&#41;</span><span
                class="sy0">;</span></code></pre>
            </td>
            <td id="results-3" class="results"></td>
          </tr>
          <tr>
            <th scope="row" id="title-4">
              <div>Error</div>
            </th>
            <td class="code">
              <pre><code>x.<span class="me1">foo</span><span class="br0">&#40;</span><span
                class="br0">&#41;</span><span class="sy0">;</span> <span
                class="co1">// unknown method</span></code></pre>
            </td>
            <td id="results-4" class="results"></td>
          </tr>
          <tr>
            <th scope="row" id="title-5">
              <div>Comments</div>
            </th>
            <td class="code">
              <pre><code><span class="co1">// comments at start</span><br>x.<span
                class="me1">reverse</span><span class="br0">&#40;</span><span
                class="br0">&#41;</span>.<span class="me1">sort</span><span
                class="br0">&#40;</span><span class="kw2">function</span><span
                class="br0">&#40;</span>a<span class="sy0">,</span> b<span
                class="br0">&#41;</span> <span class="br0">&#123;</span><br>&nbsp; <span
                class="kw1">return</span> a <span class="sy0">-</span> b<span
                class="sy0">;</span><br><span class="br0">&#125;</span><span
                class="br0">&#41;</span><span class="sy0">;</span><br><span
                class="co1">// comments at end</span></code></pre>
            </td>
            <td id="results-5" class="results"></td>
          </tr>
          </tbody>
        </table>

        <p>
          You can <a href="#" rel="nofollow">edit these tests or add even more tests to this page</a>
          by appending <code>/edit</code> to the URL.
        </p>
      </section>

      <section>
        <h2 id="results">Compare results of other browsers</h2>
        <div id="bs-results"></div>
      </section>

      <section id="comments">
        <h1>0 comments</h1>
        <div id="comments-wrapper">
          <form action="#comment-form" method="post" id="comment-form">
            <fieldset>
              <h2>Add a comment</h2>
              <div>
                <label for="author">Name <em title="This field is required">*</em></label>
                <input type="text" name="author" id="author" required>
              </div>
              <div>
                <label for="author-email">Email <em title="This field is required">*</em></label>
                <label class="inline">
                  <input type="email" name="author-email" id="author-email" required> (only used for Gravatar)
                </label>
              </div>
              <div>
                <label for="author-url">URL </label>
                <input type="url" name="author-url" id="author-url">
              </div>
              <div>
                <label for="message">Message <em title="This field is required">*</em><span>Markdown syntax is allowed</span></label>
                <textarea name="message" id="message" required></textarea>
              </div>
              <div class="buttons">
                <input type="submit" class="submit" value="Add comment">
              </div>
            </fieldset>
          </form>
        </div>
      </section>
    </article>

    <footer>
      &copy; 2014 <a href="https://jsperf.com/">jsPerf.com</a>
      &middot; <a href="https://jsperf.com/browse">Browse</a>
      &middot; <a href="https://jsperf.com/popular">Popular tests</a>
      &middot; <a href="https://jsperf.com/faq">FAQ</a>
      &middot; <a href="https://jsperf.com/faq#donate">Donate</a>
      &middot; <a href="http://twitter.com/jsperf" rel="nofollow">twitter: @jsperf</a>
      &middot; <a href="https://benchmarkjs.com/">Benchmark.js</a>
      &middot; by <a href="https://mathiasbynens.be/" title="Mathias Bynens, front-end web developer">@mathias</a>
    </footer>

    <script src="../../node_modules/lodash/lodash.js"></script>
    <script src="../../node_modules/platform/platform.js"></script>
    <script src="../../benchmark.js"></script>
    <script src="ui.js"></script>
    <script src="../../plugin/ui.browserscope.js"></script>
    <script>
      var arr = [1, 5, 4, 2, 3];

      function init() {
        window.console && console.log('init called');
      }
    </script>
    <script>
      ui.browserscope.key = 'agt1YS1wcm9maWxlcnIRCxIEVGVzdBiAgICAiI2QCgw';
      ui.browserscope.selector = '#bs-results';

      ui.add('Normal', '\
        x.sort(function(a, b) {\n\
          return a - b;\n\
        });'
      )
      .add('Exit Early', '\
        x.sort(function(a, b) {\n\
          return a - b;\n\
        });\n\
        return;'
      )
      .add('Async', {
        'defer': true,
        'fn': '\
          setTimeout(function() {\n\
            deferred.resolve();\n\
          }, 10);'
      })
      .add('Error', '\
        x.foo(); // unknown method'
      )
      .add('Comments', '\
        // comments at start\n\
        x.reverse().sort(function(a, b) {\n\
          return a - b;\n\
        });\n\
        // comments at end'
      );

      Benchmark.prototype.setup = '\
        window.foo = 42;\n\
        var x = arr;';

      Benchmark.prototype.teardown = '\
        window.foo = 24;';
    </script>
  </body>
</html>
